- max_first_name_length = max_last_name_length = 127
- form_resource_name = "new_#{resource_name}"
- button_class = local_assigns[:button_class]

= gitlab_ui_form_for(resource, as: form_resource_name, url: url,
  html: { class: 'gl-show-field-errors js-arkose-labs-form', aria: { live: 'assertive' }},
  data: { testid: 'signup-form' }) do |f|
  .devise-errors
    = render 'devise/shared/error_messages', resource: resource
  - if Gitlab::CurrentSettings.invisible_captcha_enabled
    = invisible_captcha nonce: true, autocomplete: SecureRandom.alphanumeric(12)
  - if @invite_email.present?
    .form-group
      = f.label :email, _('Email'), class: 'gl-block'
      .gl-font-bold{ 'data-testid': 'invite-email' }
        = @invite_email
      = f.hidden_field :email, value: @invite_email
      = hidden_field_tag :invite_email, @invite_email

  .name.form-row
    .col.form-group
      = f.label :first_name, _('First name'), for: 'new_user_first_name'
      = f.text_field :first_name,
        class: 'form-control gl-form-input top js-block-emoji js-validate-length js-track-error',
        data: { max_length: max_first_name_length,
        max_length_message: safe_format(s_('SignUp|First name is too long (maximum is %{max_length} characters).'),
                            max_length: max_first_name_length),
        track_action_for_errors: preregistration_tracking_label,
        testid: 'new-user-first-name-field' },
        required: true,
        title: _('This field is required.')
    .col.form-group
      = f.label :last_name, _('Last name'), for: 'new_user_last_name'
      = f.text_field :last_name,
        class: 'form-control gl-form-input top js-block-emoji js-validate-length js-track-error',
        data: { max_length: max_last_name_length,
        max_length_message: safe_format(s_('SignUp|Last name is too long (maximum is %{max_length} characters).'),
                            max_length: max_last_name_length),
        track_action_for_errors: preregistration_tracking_label,
        testid: 'new-user-last-name-field' },
        required: true,
        title: _('This field is required.')
  .username.form-group
    = f.label :username, _('Username')
    = f.text_field :username,
      class: 'form-control gl-form-input middle js-block-emoji js-validate-length js-validate-username js-track-error',
      data: signup_username_data_attributes.merge(track_action_for_errors: preregistration_tracking_label),
      pattern: Gitlab::PathRegex::NAMESPACE_FORMAT_REGEX_JS,
      required: true,
      title: _('Please create a username with only alphanumeric characters.')
    %p.validation-error.gl-text-danger.gl-field-error-ignore.gl-mt-2.field-validation.hide
      = _('Username is already taken.')
    %p.validation-success.gl-text-success.gl-field-error-ignore.gl-mt-2.field-validation.hide
      = _('Username is available.')
    %p.validation-pending.gl-field-error-ignore.gl-mt-2.field-validation.hide
      = _('Checking username availability…')
  - unless @invite_email.present?
    .form-group
      = f.label :email, _('Email')
      = f.email_field :email,
        class: 'form-control gl-form-input middle js-validate-email js-track-error',
        data: { testid: 'new-user-email-field', track_action_for_errors: preregistration_tracking_label },
        required: true,
        title: _('Please provide a valid email address.')
      %p.validation-hint.gl-text-subtle
        = _('We recommend a work email address.')
      %p.validation-warning.gl-field-error-ignore.gl-text-danger.hide
        = _('Email address without top-level domain. Make sure that you have entered the correct email address.')
      -# This is used for providing entry to Jihu on email verification
      = render_if_exists 'devise/shared/signup_email_additional_info'
  .form-group.gl-mb-5
    = render 'devise/registrations/password_input', form: f, form_resource_name: form_resource_name
    = render_if_exists 'shared/password_requirements_list', show_basic_requirements: true
  -# This is used for providing entry to Jihu phone verification
  = render_if_exists 'devise/shared/phone_verification', form: f

  .form-group
    - if arkose_labs_enabled?(user: nil)
      = render_if_exists 'devise/registrations/arkose_labs'
    - elsif show_recaptcha_sign_up?
      = recaptcha_tags nonce: content_security_policy_nonce

  = render_if_exists 'devise/registrations/opt_in_to_email', f: f
  = render 'devise/shared/terms_of_service_notice', button_text: button_text, css_class: 'gl-mt-2'

  = render Pajamas::ButtonComponent.new(type: :submit, variant: :confirm, block: true,
    button_options: { class: "#{button_class} gl-mt-4",
      data: { testid: 'new-user-register-button', track_action: 'register', track_label: preregistration_tracking_label }}) do
    = button_text
